

//  注册功能实现


// 需要获取的操作元素
// // 用户名 和 密码
// const username = document.querySelector('#input-email')
// const password = document.querySelector('#input-password')
// // 注册按钮
const postBtn = document.querySelector('#btn-register')

// 正则表达式

// username:username.value,
let uname = /^[a-zA-Z0-9]{8,30}$/

let paword = /^[a-zA-Z0-9]{6,30}$/


// serialize插件使用
const form = document.querySelector('.register-form')




// axios请求注册 'post'

async function postUserData() {

    try {
        let data = serialize(form, { hash: true, empty: true })
        let userData = await axios({
            url: '/register',
            method: 'POST',
            data:data
        })
        //    console.log(userData);
        let userDates = userData.data.data
        console.log('输入的数据', userDates);
        return userDates
    } catch (error) {
         
        console.error(error)

    }
}

//  postUserData() 

postBtn.addEventListener('click', async (e) => {
     e.preventDefault()

    // 对象解构得到，对象属性的数据
    //  对象解构解释：解构是一种从数组或对象中提取数据的简洁语法。它允许你从数组或对象中提取值并赋给变量，而无需手动访问每个属性或索引。
     let  data = serialize(form, { hash: true, empty: true })
     console.log('zcdf',data);
     
     let  {username} =  data
     let  {password} =  data
    if (!uname.test(username) || !paword.test(password)) {
        alert('输入不符合要求，请重新输入')
        return
    }else{
        let userData = await postUserData()
        // console.log('函数得到的数据', userData)
        
        alert('注册成功，可以登录了')
        location.reload()

    }
   
})


